<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <meta name="author" content="Cassie">
  <!-- ie浏览器使用最新的edge引擎渲染页面 -->
  <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <meta name="keywords" content="Notes">
  <title>Cassie_Notes</title>
  <link rel="shortcut icon" href="./images/logo.ico"/>
  <link rel="stylesheet" href="./css/index.css">
  <!-- link bootstrap -->
  <link rel="stylesheet" href="./css/bootstrap.min.css"/>
  <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"/></script>
  <script src="./js/bootstrap.min.js"></script> 
  <style>
 
  </style>
 </head>
 <body>
        <textarea style='width:300px;height:200px;' id='txtCode'>
<pre>
<a href="" id="js">js</a>
<script>
    var js = document.getElementById('js')
    js.onclick = function() {
        alert('this is js')
    }

</script>

</pre>
        
        </textarea>
        <iframe name="zhidao" frameborder="1" width="700px" height="300px" id="my"></iframe>
        <input type='button' value='直接运行' id='btnRun'/>

        <script>
          document.getElementById('btnRun').onclick = function(){
            var runHtml = document.getElementById('txtCode').value;
            if(runHtml){
              var win = window.open('', 'zhidao');
              win.document.open();
              win.document.write(runHtml);
            }
            
          }
          setTimeout(function(){
              document.getElementById('my').contentWindow.document.body.innerText = "";
          },1000)
          
        </script>



  </body>
</html>